<!-- directive:title 提示信息展示样式 -->
<!-- directive:breadcrumb 提示信息 -->
<div class='panel-body'>
    <h4>Dynamic</h4>
    <div class="form-group">
      <label>Popup Text:</label>
      <input type="text" ng-model="dynamicPopover.content" class="form-control">
    </div>
    <div class="form-group">
      <label>Popup Title:</label>
      <input type="text" ng-model="dynamicPopover.title" class="form-control">
    </div>
    <div class="form-group">
      <label>Popup Template:</label>
      <input type="text" ng-model="dynamicPopover.templateUrl" class="form-control">
    </div>
    <button uib-popover="{{dynamicPopover.content}}" popover-title="{{dynamicPopover.title}}" type="button" class="btn btn-default">Dynamic Popover</button>

    <button uib-popover-template="dynamicPopover.templateUrl" popover-title="{{dynamicPopover.title}}" type="button" class="btn btn-default">Popover With Template</button>

    <script type="text/ng-template" id="myPopoverTemplate.html">
        <div>{{dynamicPopover.content}}</div>
        <div class="form-group">
          <label>Popup Title:</label>
          <input type="text" ng-model="dynamicPopover.title" class="form-control">
        </div>
    </script>
    <hr />
    <h4>Positional</h4>
    <div class="form-group">
      <label>Popover placement</label>
      <select class="form-control" ng-model="placement.selected" ng-options="o as o for o in placement.options"></select>
    </div>
    <button popover-placement="{{placement.selected}}" uib-popover="On the {{placement.selected}}" type="button" class="btn btn-default">Popover {{placement.selected}}</button>

    <hr />
    <h4>Triggers</h4>
    <p>
      <button uib-popover="I appeared on mouse enter!" popover-trigger="'mouseenter'" type="button" class="btn btn-default">Mouseenter</button>
    </p>
    <input type="text" value="Click me!" uib-popover="I appeared on focus! Click away and I'll vanish..."  popover-trigger="'focus'" class="form-control">

    <hr />
    <h4>Other</h4>
    <button popover-animation="true" uib-popover="I fade in and out!" type="button" class="btn btn-default">fading</button>
    <button uib-popover="I have a title!" popover-title="The title." type="button" class="btn btn-default">title</button>
    <button uib-popover="I am activated manually" popover-is-open="popoverIsOpen" ng-click="popoverIsOpen = !popoverIsOpen" type="button" class="btn btn-default">Toggle popover</button>
    <button uib-popover-html="htmlPopover" class="btn btn-default">HTML Popover</button>
    <button uib-popover-html="'<b>HTML</b>, <i>inline</i>'" class="btn btn-default">HTML Popover (inline)</button>
    <pre better-pre>
        popover有三个版本：uib-popover和uib-popover-template，和uib-popover-html：

        uib-popover - 仅使用文本，并将转义为弹出框体提供的任何HTML。
        uib-popover-html $ - 采用一个计算结果为HTML字符串的表达式。请注意，此HTML未编译。如果需要编译，请改用uib-popover-template属性选项。 用户有责任确保将内容安全放入DOM中！
        uib-popover-template $ - 表示用于弹出框体的模板位置的URL。请注意，此模板的内容需要包含在标记中，例如<div></div>。
        uib-popover- *设置
        所有这些设置都可用于三种类型的弹出窗口。

        popover-animation $  Ç  （默认：true，配置：animation） -如果它淡入和淡出？

        popover-append-to-body $  Ç  （默认值：false，配置：appendToBody） -如果该酥料饼的被附加到“$体”，而不是父元素？

        popover-class - 要应用于弹出窗口的自定义类。

        popover-enable $  （默认值：true） -是启用？它将启用或禁用已配置的popover-trigger。

        popover-is-open  （默认值：false） -是否显示酥料饼。

        popover-placement Ç  （默认值：top，配置：placement） -传递在放置之前由空格分隔将使自动定位“自动”，例如：“自动左下”。popover将尝试定位它最适合最近的可滚动祖先的位置。接受：

        top - popover在顶部，水平居中于host元素。
        top-left - 弹出顶部，左边缘与主机元素左边缘对齐。
        top-right - 弹出顶部，右边缘与主机元素右边缘对齐。
        bottom - 在底部弹出，在主机元素上水平居中。
        bottom-left - 在底部弹出，左边缘与主机元素左边缘对齐。
        bottom-right - 弹出底部，右边缘与主机元素右边缘对齐。
        left - 左侧弹出，垂直居中于主机元素。
        left-top - 左侧弹出，顶部边缘与主机元素顶部边缘对齐。
        left-bottom - 左侧弹出，底部边缘与主机元素底部边缘对齐。
        right - 右侧弹出，垂直居中于主机元素。
        right-top - 右侧弹出，顶部边缘与主机元素顶部边缘对齐。
        right-bottom - 右侧弹出，底部边缘与主机元素底部边缘对齐。
        popover-popup-close-delay Ç  （默认：0，配置：popupCloseDelay） -应给予多长时间的酥料饼收盘触发事件后继续开放？

        popover-popup-delay Ç  （默认：0，配置：popupDelay） -以毫秒为单位弹出延迟，直至打开。

        popover-title - 显示为花哨标题的字符串。

        popover-trigger $  （默认值：'click'） -我应该触发酥料饼的节目？支持以空格分隔的事件名称或对象列表（参见下文）。

        注意：要配置工具提示，您需要执行此操作$uibTooltipProvider（另请参见下文）。

        触发器
        开箱即用支持以下show触发器及其提供的隐藏触发器：

        mouseenter： mouseleave
        click： click
        outsideClick： outsideClick
        focus： blur
        none
        该outsideClick触发器将导致酥料饼的切换上点击，并点击任何东西时隐藏。

        对于任何不受支持的值，触发器将用于显示和隐藏弹出窗口。使用'none'触发器将禁用内部触发器，然后可以popover-is-open专门使用该属性来显示和隐藏弹出窗口。

        $ uibTooltipProvider
        通过$uibTooltipProvider，您可以更改默认情况下工具提示和弹出窗口的行为方式; 上述属性始终优先。可以使用以下方法：

        setTriggers(obj) （例如：{ 'openTrigger': 'closeTrigger' }） -扩展用自己的的映射提及的默认触发映射。

        options(obj) - 为某些工具提示和弹出属性提供一组默认值。目前支持具有C徽章的那些。
    </pre>
</div>

